<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>站酷主页</title>
    <link rel="stylesheet" type="text/css" href="./stylesheets/index.css">
</head>

<body>
    <div id="external">
        <!-- 导航栏 -->
        <div class="nav_top">
            <a href="#"></a>
            <ul id="discoloration">
                <li><a href="#">首页</a></li>
                <li>
                    <a href="#">发现</a>
                </li>
                <li><a href="#">同城</a></li>
                <li id="job">
                    <a href="#">职位</a>
                    <ul>
                        <li><a href="#">职位</a></li>
                        <li><a href="#">公司</a></li>
                        <li><a href="#">+发布职位</a></li>
                    </ul>
                </li>
                <li id="active">
                    <a href="#">活动</a>
                    <ul>
                        <li><a href="#">设计大赛</a></li>
                        <li><a href="#">专题策划</a></li>
                        <li><a href="#">线上活动</a></li>
                        <li><a href="#">线下活动</a></li>
                    </ul>
                </li>
                <li id="matter">
                    <a href="#">正版素材</a>
                    <ul>
                        <li><a href="#">图片</a></li>
                        <li><a href="#">视频</a></li>
                        <li><a href="#">字体</a></li>
                        <li><a href="#">音乐</a></li>
                    </ul>
                </li>
                <li id="course">
                    <a href="#">课程</a>
                    <ul>
                        <li><a href="#">正在热销</a></li>
                    </ul>
                </li>
                <li id="ellipsis">
                    <a href="#">...</a>
                    <ul>
                        <li><a href="#">榜单</a></li>
                        <li><a href="#">设计师</a></li>
                        <li><a href="#">站酷APP</a></li>
                    </ul>
                </li>
            </ul>
            <div class="sea"><a href="#"><img src="./images/1.png" alt=""></a></div>
            <div class="yun"><a href="#"><img src="./images/2.png" alt=""></a></div>
            <div class="login1"><a href="#">登录</a></div>
            <div class="login2"><a href="register.html">注册</a></div>
        </div>

        <!-- 轮播图 -->

        <div id="container">
            <button id="prev_btn"><</button>
            <button id="next_btn">></button>
            <ul id="banner_container">
                <li><img src="https://img.zcool.cn/community/01f1515ca2ca6da801214168c2ae09.jpg@1380w" alt=""></li>
                <li><img src="https://img.zcool.cn/community/0138ec5ca44892a801208f8be4c0ea.jpg@1380w" alt=""></li>
                <li><img src="https://img.zcool.cn/community/01b73c5ca2ca82a801214168fa83fa.jpg@1380w" alt=""></li>
                <li><img src="https://img.zcool.cn/community/01037e5ca2ca93a801208f8b8d457d.jpg@1380w" alt=""></li>
                <li><img src="https://img.zcool.cn/community/01da355ca419dfa8012141682afdd2.jpg@1380w" alt=""></li>
                <li><img src="https://img.zcool.cn/community/01f1515ca2ca6da801214168c2ae09.jpg@1380w" alt=""></li>
            </ul>
        </div>


        <!-- 轮播图下的广告 -->
        <div id="advert">
            <ul>
                <li><a href=""><img src="./images/3b60508c1afbe43578e826c4171f1377.jpg" alt=""></a></li>
                <li><a href=""><img src="./images/9c42b57de31668e7339083e0ef5ae712.jpg" alt=""></a></li>
                <li><a href=""><img src="./images/46c6a421c92e39572fac3c2ac14f58b3.jpg" alt=""></a></li>
                <li><a href=""><img src="./images/799d1f652ea8622116b6473cdd2db686.jpg" alt=""></a></li>
                <li id="li1"><a href=""><img src="./images/2393ff6d5164d474f101a4bcf5e57098.jpg" alt=""></a></li>
            </ul>
        </div>
 
        <!-- 小标题 -->
        <div id="tit">
            <div id="title">
                <ul>
                    <li class="li1"><a href="">首页推荐</a></li>
                    <li><a href="">最新发布</a></li>
                    <li class="li3"><a href="">上升最快</a></li>
                </ul>
            </div>
        </div>
        <!-- 主要内容 -->
        <div id="content">
            <div id="module">
            </div>
            <div id="page">
                <ul>
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">6</a></li>
                    <li><a href="#">7</a></li>
                    <li><a href="#">...</a></li>
                    <li><a href="#">99</a></li>
                    <li><a href="#">100</a></li>
                    <li><a href="#">></a></li>
                </ul>
            </div>
            <img id="advertisement" src="https://reviveimg.hellorf.com/www/images/848d1d3be6995405456eebc626018628.jpg"
                alt="">
            <p>
                <a class="a1" href="">猜你喜欢</a>
                <a class="a2" href="">换一换</a>
            </p>
            <div id="like">
                <ul>
                    <li>
                        <img src="https://img.zcool.cn/community/014ab15ca1950fa801208f8be3f1a8.jpg@260w_195h_1c_1e_1o_100sh.jpg"
                            alt="">
                        <a href="#">《都挺好》现实案例</a>
                    </li>
                    <li>
                        <img src="https://img.zcool.cn/community/01e5405c9d8b97a801208f8b4acc85.jpg@260w_195h_1c_1e_1o_100sh.jpg"
                            alt="">
                        <a href="#">阶段性版式心得分享</a>
                    </li>
                    <li>
                        <img src="https://img.zcool.cn/community/01bfda5c9d2990a80121416897f5b9.jpg@260w_195h_1c_1e_1o_100sh.jpg"
                            alt="">
                        <a href="#">品牌案例|亿觅妖风小...</a>
                    </li>
                    <li>
                        <img src="https://img.zcool.cn/community/011ad85c9dc25ba801208f8b125561.jpg@260w_195h_1c_1e_1o_100sh.jpg"
                            alt="">
                        <a href="#">为什么有的人对螺蛳粉...</a>
                    </li>
                    <li>
                        <img src="https://img.zcool.cn/community/01b3e35c9ecb16a8012141684878b4.jpg@260w_195h_1c_1e_1o_100sh.jpg"
                            alt="">
                        <a href="#">诗人改稿|背景如何做...</a>
                    </li>
                </ul>
                <button id="goTop">↑</button>
            </div>
        </div>

        <!--结尾友情链接  -->
        <div id="foot">
            <div id="footer">
                <div id="footer_top">
                    <ul>
                        <li class="list1"><a href=""><img src="./images/7.png" alt="">移动版</a></li>
                        <li><a href="">关于我们</a></li>
                        <li><a href="">加入酷站</a></li>
                        <li><a href="">用户协议</a></li>
                        <li><a href="">企业服务</a></li>
                        <li><a href="">帮助中心</a></li>
                        <li><a href="">联系我们</a></li>
                        <li><a href="">中文</a></li>
                        <li><a href="">English</a></li>
                    </ul>
                    <a class="im1" href="#"><img src="./images/8.png" alt=""></a>
                    <a class="im2" href="#"><img src="./images/9.png" alt=""></a>
                </div>
                <div id="footer_bottom">
                    <ul>
                        <li class="ls1"><a href="#">京ICP备11017824号-4</a></li>
                        <li><a href="#">京ICP证130164号</a></li>
                        <li class="ls3"><a href="#"><img src="/images/10.png" alt="">京公网安备11010502000501号</a></li>
                        <li><a href="#">网络文化经营许可证 京网文[2016]6173-844号</a></li>
                        <li class="ls5"><a href="#">广播电视节目经营许可证（京）字第06990号</a></li>
                        <li class="ls6"><a href="#">网上有害信息举报专区</a></li>
                        <li class="ls7"><a href="#">不良信息举报电话：010-56538658</a></li>
                        <li class="ls8"><a href="#">举报邮箱jubao@zcool.com.cn</a></li>
                        <li class="ls9"><a href="#">联系电话010-56538600</a></li>
                        <li class="ls10"><a href="#">Copyright©2006-2019ZCOOL站酷</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <script src="./scripts/index.js"></script>
</body>

</html>